<template>
  <div class="income-detail">
    <div class="details">
      <div class="f20">概要</div>
      <Row class="mt20">
        <Col span="12">
          <div>支付单位：江西xxxxx有限公司</div>
          <div class="mt10">创建时间：2019-09-09 12:09:28</div>
          <div class="mt10">支付金额：¥10000.00 （支付宝¥6000，保证金¥4000）
            &nbsp;&nbsp;&nbsp;&nbsp;
          </div>
        </Col>
        <Col span="12">
          <div>&nbsp;</div>
          <div class="mt10">支付时间：2019-09-09 12:09:28</div>
          <div class="mt10">
                <Button type="warning" ghost size="small" @click="expend = !expend">{{expend ? '收起扣款详情' : '查看扣款详情'}}</Button>
          </div>
        </Col>
      </Row>
      <Table stripe :columns="columns1" :data="data1" class="mt20" v-show="expend">
        <template slot-scope="{ row, index }" slot="action">
          <Icon type="ios-paper c1" size="20" @click="gotoDetail(row)"/>
        </template>
      </Table>
    </div>
    
    <div class="details mt20">
      <div class="f20">订单详情</div>
      
      <Table stripe :columns="columns2" :data="data1" class="mt20">
        <template slot-scope="{ row, index }" slot="action">
          <Icon type="ios-paper c1" size="20" @click="gotoDetail(row)"/>
        </template>
      </Table>
    </div>
    
  </div>
</template>

<script>
  export default {
    data () {
      return {
        expend: false,
        position:[
          {title: '云服务', link:'/admin/cloudService'},
          {title: '我的服务', link:'/admin/cloudService/buy'},
          {title: '服务详情'}
        ],
        columns1: [
          {title: '支付渠道', key: 'id'},
          {title: '扣款费用（元）', key: 'address'},
          { title: '扣款时间', key: 'address'},
          { title: '流水编号', key: 'address'},
          { title: '支付账号', key: 'address'},
          
         ],
         columns2:[
           {title: '产品名称', key:'id'},
           {title: '产品型号', key:'id'},
           {title: '数量', key:'id'},
           {title: '具体参数', key:'id'},
           {title: '购买周期', key:'id'},
           {title: '起止时间', key:'id'},
           {title: '状态', key:'id'},
           {title: '支付金额（元）', key:'id'},
           {title: '优惠金额（元）', key:'id'},
           {title: '其他支付（元）', key:'id'},
           
         ],
         data1:[
           {
             id: '103232',
             'address': 'fsdfsdfdsf'
           },
           
           
         ]
      }
    },
    mounted () {
      this.$store.commit('UPDATE_POSITION', this.position)
    },
    methods:{
      
    }
  }
</script>

<style lang="less" scoped>
  .details {
    background: #f2f2f2;
    padding: 10px;
  }
</style>
